Color Theory
Table of Contents
1. Color Spaces
1.1. CIE 1931 Color Space
It was defined in 1931 by Commission Internationale de l'éclairage, International Commission on Illumination.
Color is measured based on the effective value of stimulus in three kinds of cone cell, \( [L, M, S] \). It can be tranformed to other represention by matrices. In reality the color matching functions are used for calculation.
1.1.1. CIE XYZ Color Space
where \( L_{\mathrm{e}, \Omega, \lambda} \) is the spectral radiance, \( \bar{x}, \bar{y}, \bar{z} \) are the color matching functions.
\( Y \) is the luminance, \( Z \) is quasi-equal to blue of CIE RGB, and \( X \) is the the mix of the mix of red, green, and blue. This space is a linear transformation of the LMS space.
This is the space in which the color can be added directly, thereby forming a convex subset of three dimensional space.
1.1.2. CIE xy Chromaticity Diagram
This is the projection of the \( X + Y + Z = 1 \) plane onto the \( XY \) plane.
1.1.3. Optimal Solid
The solids whose points have less energy than certain threshold.
1.2. RGB Color Model
There are various RGB color spaces depending on the primary colors, transfer function (gamma), and the white point. The primary colors are often certain shade of red, green, and blue.
RGB is a great way of describing color since the convex combination of the primaries covers as much gamut as possible.
1.2.1. sRGB
- Standard RGB
HP and Microsoft proposed it in 1996, and it became the official standard of the International Electotechnical Commision (IEC).1 It is the standard color space for the web, and the default color profile of images.
Roughly speaking, sRGB uses \( \gamma = 2.2 \). This means that the color value stored means the perceived intensity. In order to convert to the physical intensity, red, green, and blue value need to be each exponentiated by \( \gamma \).
If \( \gamma = 1 \) the color space is called linear, and the colors can be added directly.
1.3. HSV, HSL, and HSI
HSV or HSL are different ways of representing the RGB color space. The specific color space that HSV refers to depends on the being discussed.
The RGB color coordinates \( R, G, B \) are assumed to range from 0 to 1,
1.3.1. Value
- Brightness
\[ V := \max(R, G, B) \]
1.3.2. Lightness
\[ L := \operatorname{mid}(R,G,B) \]
1.3.3. Intensity
\[ I := \operatorname{avg}(R, G, B) \]
1.3.4. Chroma
\[ C := \operatorname{range}(R, G, B) \]
1.3.5. Saturation
\[ S_{\rm HSV} := \begin{cases} 0 & \text{if } V=0,\\ \frac{C}{V} & \text{otherwise} \end{cases} \]
\[ S_{\rm HSL} := \begin{cases} 0 & \text{if $L=0$ or $L=1$,} \\ \frac{C}{2L} & \text{if $L \le 1/2$,} \\ \frac{C}{2-2L} & \text{if $L > 1/2$.}\end{cases} \]
1.3.6. Hue
\[ H := 60\times \begin{cases} 0, & \text{if }C=0 \\ \frac{\displaystyle G-B}{\displaystyle C}\mod 6, & \text{if }V=R \\ \frac{\displaystyle B-R}{\displaystyle C}+2, & \text{if }V=G \\ \frac{\displaystyle R-G}{\displaystyle C}+4, & \text{if }V=B \end{cases} \]
1.4. Y'CbCr
Another representation of RGB color space, in which \( Y' \) is the luma, and \( C_B, C_R \) are the blue-difference and red-difference chroma.
It is simply a linear transformation of the non-linear RGB space, where the luma represents the perceived brightness. The transformation is given by: \[ \begin{bmatrix} Y' \\ P_B \\ P_R \end{bmatrix} = \begin{bmatrix} K_R & K_G & K_B \\ -\frac{1}{2}\frac{K_R}{1 - K_B} & -\frac{1}{2}\frac{K_G}{1 - K_B} & \frac{1}{2} \\ \frac{1}{2} & -\frac{1}{2}\frac{K_G}{1-K_R} & -\frac{1}{2}\frac{K_B}{1-K_R} \\ \end{bmatrix} \begin{bmatrix} R' \\ G' \\ B' \end{bmatrix} \] where \( K_R, K_G, K_B \) are predefined constants that sum to 1. Y'PbPr is then digitized in order to obtain Y'CbCr.
It is known that human is insensitivity to the change in Cb and Cr compared to the change in Y'. Consequently, the video and JPEG compression can throw more information away in the chroma.
1.5. Munsell Color System
Created in the first decade of 20th century by Albert H. Munsell. It is the first system that uses hue, chroma, and value to organize the colors in the perceptually uniform space.
It was adopted by United States Department of Agriculture as an official color space for soil in 1930s, and still used to this day.
A color is described as 10PB 7/8, where 10PB is the hue, 7 is the value, and 8 is the chroma.
1.5.1. Hue
5 principal hues:
- Red
- Yellow
- Green
- Blue
- Purple
and 5 intermediate hues:
- YellowRed
- GreenYellow
- BlueGreen
- PurpleBlue
- RedPurple
are each subdivided into 10 steps, each step gets a interger with 5 being the center, forming the entire hue circle.
5R -> 10R = 0YR -> 5YR -> 10YR -> …
1.5.2. Chroma
It tells the purity of the color which is roughly related to saturation.
1.5.3. Value
The value is subdivided into 11 levels (0~10), and it tells the lightness with 10 being the brightest.
1.6. CIE LAB Color Space
Color space defined by the International Commision on Illumination (CIE) in 1976. \( L^* \) is the perceptual lightness, \( a^* \) and \( b^* \) are value for the four unique colors.
\begin{align*} L^\star &= 116f(Y/Y_{\mathrm{n}}) - 16, \\ a^\star &= 500(f(X/X_{\mathrm{n}}) - f(Y/Y_{\mathrm{n}})),\\ b^\star &= 200(f(Y/Y_{\mathrm{n}}) - f(Z/Z_{\mathrm{n}})) \end{align*}where \[ f(t) = \begin{cases} \sqrt[3]{t} & t > \delta^3 \\ \frac{1}{3}t\delta^{-2} + \frac{4}{29} & \text{otherwise} \end{cases}, \quad \delta = \frac{6}{29} \] and \( X_{\mathrm{n}}, Y_{\mathrm{n}}, Z_{\mathrm{n}} \) are predefined numbers about 100.
This takes into account that human differentiate darker shades more easily that lighter ones, to match the perceived difference in colors.
1.7. Oklab Color Space
It was introduced by Björn Ottosson in December 2020.
This space is more perceptually uniform. The gamma correction is done on the LMS space, so that it respects the biology more precisely.
\begin{align*} x_i = M_{2, ij}\sqrt[3]{M_{1,jk}X_k} \end{align*}where \( x_i \) are the coordinates \( L, a, b \), and \( X_k \) are the CIE XYZ coordinates. The matrices are predefined.
2. Color Harmony
Figure 1: Traditional RYB Color Wheel
2.1. Analogous Colors
Colors right next to the other on the color wheel.
2.2. Complementary Colors
Opposite colors in the color wheel.
2.3. Triadic Colors
The set of three colors that form a triangle on the color wheel.
3. Color Psychology
3.1. Red
- Passion
- Danger
3.2. Orange
- Energy
- Creative
3.3. Yellow
- Happy
- Active
3.4. Green
- Nature
- Healthy
3.5. Blue
- Calm
- Wisdom
3.6. Purple
- Wealth
- Ambition
3.7. Black
- Death
- Power
3.8. White
- Purity
- Peace
4. References
- What's the "Geometry" of Colours? - YouTube
- CIE 1931 color space - Wikipedia
- RGB color spaces - Wikipedia
- All color is best-effort - YouTube
- HSL and HSV - Wikipedia
- YCbCr - Wikipedia
- A perceptual color space in Minecraft (Oklab) - YouTube
- Oklab color space - Wikipedia
- Two new color spaces for color picking - Okhsv and Okhsl
- The Amazing Math behind Colors! - YouTube
- RYB Color Model: History, Art, and Influence on Modern Design - Red Yellow Bl…
- Color Theory for Noobs | Beginner Guide - YouTube
Footnotes:
IEC 61966-2-1:1999.